<template>
  <div class="common-title">
    <div class="title">{{ props.title }}</div>
    <div class="line">
      <img src="../../assets/imgs/line1.png" alt="" />
    </div>
    <slot></slot>
  </div>
</template>

<script setup lang='ts'>
const props = defineProps({
  title: {
    type: String,
    default: ""
  }
})
</script>

<style lang='less' scoped>
.common-title{
  width: 100%;
  display: flex;
  align-items: center;
  .title{
    // width: 5vw;
    white-space: nowrap;
    font-family: "YSBTH";
    font-size: 24px;
    text-shadow: 0 0 7px #19a6fd;
  }
  .line{
    flex: 1;
    margin: 0 1vh;
    img{
      width:  100%;
      display: block;
    }
  }
}
</style>